<template>
  <div class="table-wrap">
    <div class="form-header">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item label="">
          <el-select
            v-model="formInline.status"
            class="m-2"
            clearable
            placeholder="筛选"
          >
            <el-option label="草稿" value="0" />
            <el-option label="待审核" value="1" />
            <el-option label="已上架" value="2" />
          </el-select>
        </el-form-item>
        <el-form-item label="">
          <el-input
            v-model="formInline.user"
            placeholder="输入名称/编号/其他搜索"
            clearable
          />
        </el-form-item>
        <el-form-item label="">
          <el-input
            v-model="formInline.region"
            placeholder="输入商品名称搜索"
            clearable
          />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
          <el-button type="primary" @click="handleAdd">新增商品</el-button>
          <el-button type="warning">批量删除</el-button>
        </el-form-item>
      </el-form>
      <div class="operate-btn-wrap">
        <el-button type="primary">类别筛选</el-button>
        <el-button type="primary">批量导入</el-button>
        <el-button type="primary">导出Excel</el-button>
      </div>
    </div>
    <el-table
      ref="multipleTableRef"
      :data="tableData"
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="55">
        <template #default="scope">
          {{ getIndex(scope.$index) }}
        </template>
      </el-table-column>

      <el-table-column
        v-for="item in tableHeader"
        :key="item"
        :prop="item.prop"
        :label="item.name"
      >
        <template #default="scope">
          <img
            :src="scope.row[item.prop]"
            v-if="item.type == 'uploadImg'"
            style="width: 80px; height: 60px"
            alt=""
          />
          <div v-if="item.type == 'isRadio'">
            {{ scope.row[item.prop] == 0 ? "是" : "否" }}
          </div>
          <div v-if="item.prop == 'status'">
            <span v-if="scope.row[item.prop]">{{
              statusDesc(scope.row[item.prop])
            }}</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="250">
        <template #default="scope">
          <el-button @click="copyRow(scope.row)" link type="primary"
            >复制</el-button
          >
          <el-button @click="handleEdit(scope.row)" link type="primary"
            >编辑</el-button
          >
          <el-button
            v-if="scope.row.status == 0 || scope.row.status == 3"
            @click="handleSubmit(scope.row)"
            link
            type="primary"
            >提交</el-button
          >
          <el-button
            v-if="scope.row.status == 2 || scope.row.status == 5"
            @click="handlePutOnByAdmin(scope.row)"
            link
            type="primary"
            >上架</el-button
          >
          <el-button
            v-if="scope.row.status == 4"
            @click="handlePutOff(scope.row)"
            link
            type="primary"
            >下架</el-button
          >
          <el-button
            v-if="scope.row.status == 1"
            @click="handleExamine(scope.row)"
            link
            type="primary"
            >审核</el-button
          >
          <el-button
            v-if="scope.row.status == 0"
            @click="handleDelete(scope.row)"
            link
            type="primary"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <el-dialog
      v-model="dialogVisible"
      :title="dialogTitle"
      width="600px"
      align-center
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <el-form
        ref="ruleFormRef"
        :model="ruleForm"
        :rules="rules"
        label-width="120px"
        class="demo-ruleForm"
        status-icon
      >
        <template v-for="item in tableHeader" :key="item">
          <el-form-item
            v-if="!item.hidden"
            :label="item.name"
            :prop="item.prop"
          >
            <el-select
              @change="selectChange(item.prop)"
              :disabled="item.disabled ? item.disabled : false"
              v-if="item.type == 'select'"
              :multiple="item.multi ? true : false"
              v-model="ruleForm[item.prop]"
              placeholder=""
            >
              <el-option
                v-for="(key, idx) in item.options"
                :key="idx"
                :label="key.name"
                :value="key.id"
              />
            </el-select>
            <el-input
              v-if="item.type == 'input'"
              placeholder="请输入"
              v-model="ruleForm[item.prop]"
            ></el-input>
            <el-upload
              v-if="item.type == 'uploadImg'"
              class="upload-demo"
              action="#"
              :auto-upload="false"
              :file-list="ruleForm[item.prop]"
              :on-change="
                (file, fileList) => {
                  handleUploadChange(item.prop, file, fileList);
                }
              "
              :limit="1"
              :on-exceed="handleExceed"
              :on-preview="handlePreview"
              :on-remove="handleRemove"
              list-type="picture"
            >
              <el-button type="primary">点击上传</el-button>
            </el-upload>
            <NumberRange
              :value="ruleForm[item.prop]"
              v-if="item.type == 'numberRange'"
            ></NumberRange>
            <div v-if="item.type == 'text'">{{ ruleForm[item.prop] }}</div>
            <el-radio-group
              v-if="item.type == 'isRadio'"
              v-model="ruleForm[item.prop]"
            >
              <el-radio label="1">是</el-radio>
              <el-radio label="2">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </template>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="confirmForm"> 确认 </el-button>
        </span>
      </template>
    </el-dialog>
    <el-dialog
      v-model="centerDialogVisible"
      title="邀请链接"
      width="60%"
      align-center
    >
      <div :class="copyLinkActive ? 'active' : ''" class="link-content">
        {{ copyLinkValue }}
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="centerDialogVisible = false">关闭</el-button>
          <el-button type="primary" @click="confirmCopy"> 复制 </el-button>
        </span>
      </template>
    </el-dialog>
    <el-dialog width="600px" v-model="outerVisible" title="拒绝审核">
      <el-input v-model="reason" placeholder="请输入原因"></el-input>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="outerVisible = false">取消</el-button>
          <el-button type="primary" @click="rejectHanldle"> 确定 </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import { ref, reactive, computed, nextTick, onMounted } from "vue";
import cache from "@/plugins/cache";
import {
  getMaterialInfos,
  getMaterialCategoryInfo,
  addMaterialInfo,
  getMaterialInfo,
  modifyMaterialInfo,
  deleteMaterialInfo,
  getPublicFileUrl,
} from "@/api/level-third";
import {
  getCommodityInfos,
  addCommodityInfos,
  modifyCommodityInfo,
  examineCommodityInfo,
  putOffCommodityInfo,
  deleteCommodityInfo,
  submitCommodityInfo,
  putOnCommodityInfo,
  putOnCommodityInfoByAdmin,
} from "@/api/product";
import * as qiniu from "qiniu-js";
import SparkMD5 from "spark-md5";
import { getMaterialSupplierInfos } from "@/api/material";
import { getInitMultipartUploadWithPublic } from "@/api/login";
import NumberRange from "@/components/InputNumberRange";
import { getFilesUrl, copyDomText } from "@/utils/index";
import { ElMessage, ElMessageBox } from "element-plus";
const formInline = reactive({
  user: "",
  region: "",
  status: "",
});
const publicFileUrl = ref("");

onMounted(() => {
  publicFileUrl.value = cache.session.getJSON("publicUrl");
  console.log(publicFileUrl.value);
});
const outerVisible = ref(false);
const reason = ref("");
const ruleForm = reactive({
  materialSupplierName: "",
  commodityName: "",
  coverPage: [],
  brand: "",
  materialCategoryName: "",
  primaryMaterialName: "",
  secondaryMaterialName: "",
  materialName: "",
  model: "",
  specifications: "",
  producer: "",
  isRovideSample: "",
});
// 状态（0：草稿，1：待审核，2：待上架，3：审核不通过，4:已上架，5：已下架）
const statusDesc = (status) => {
  let temp = "";
  switch (status) {
    case "0":
      temp = "草稿";
      break;
    case "1":
      temp = "待审核";
      break;
    case "2":
      temp = "待上架";
      break;
    case "3":
      temp = "审核不通过";
      break;
    case "4":
      temp = "已上架";
      break;
    case "5":
      temp = "已下架";
      break;

    default:
      temp = "";
      break;
  }
  return temp;
};
const multipleTableRef = ref();
const multipleSelection = ref([]);
const toggleSelection = (rows) => {
  if (rows) {
    rows.forEach((row) => {
      multipleTableRef.value.toggleRowSelection(row);
    });
  } else {
    multipleTableRef.value.clearSelection();
  }
};
const handleSelectionChange = (val) => {
  multipleSelection.value = val;
};
const currentPage = ref(1);
const pageSize = ref(10);
const largeLevelSelectedData = ref([]);
const primaryMaterialSelectedData = ref([]);
const secondaryMaterialSelectedData = ref([]);
const thirdMaterialSelectedData = ref([]);
const primaryMaterialDisabled = ref(true);
const secondaryMaterialDisabled = ref(true);
const thirdMaterialDisabled = ref(true);
const tableHeader = ref([
  {
    prop: "materialSupplierName",
    name: "材料商",
    type: "select",
    options: computed(() => materialSupplierNameList.value),
  },
  { prop: "coverPage", name: "封面", type: "uploadImg" },
  { prop: "commodityName", name: "商品名称", type: "input" },
  { prop: "brand", name: "品牌", type: "input" },
  {
    prop: "materialCategoryName",
    name: "材料大类",
    type: "select",
    options: computed(() => largeLevelSelectedData.value),
  },
  {
    prop: "primaryMaterialName",
    name: "一级材料",
    type: "select",
    disabled: computed(() => primaryMaterialDisabled.value),
    options: computed(() => primaryMaterialSelectedData.value),
  },
  {
    prop: "secondaryMaterialName",
    name: "二级材料",
    type: "select",
    disabled: computed(() => secondaryMaterialDisabled.value),
    options: computed(() => secondaryMaterialSelectedData.value),
  },
  {
    prop: "materialName",
    name: "三级材料",
    type: "select",
    filterable: true,
    // disabled: computed(() => thirdMaterialDisabled.value),
    options: computed(() => thirdMaterialSelectedData.value),
  },
  { prop: "model", name: "型号", type: "input" },
  { prop: "specifications", name: "规格", type: "input" },
  { prop: "producer", name: "产地", type: "input" },
  { prop: "isRovideSample", name: "是否提供样品", type: "isRadio" },
  { prop: "status", name: "状态", type: "text", hidden: true },
]);
const selectChange = (param) => {
  if (param == "materialCategoryName") {
    primaryMaterialSelectedData.value = [];
    ruleForm.primaryMaterialName = "";
    secondaryMaterialSelectedData.value = [];
    ruleForm.secondaryMaterialName = "";
    thirdMaterialSelectedData.value = [];
    ruleForm.materialName = "";
  }
  if (param == "primaryMaterialName") {
    secondaryMaterialSelectedData.value = [];
    ruleForm.secondaryMaterialName = "";
    thirdMaterialSelectedData.value = [];
    ruleForm.materialName = "";
  }
  if (param == "secondaryMaterialName") {
    thirdMaterialSelectedData.value = [];
    ruleForm.materialName = "";
  }
};
const getSelectedDataByLevel = async (parentId) => {
  try {
    const res = await getMaterialCategoryInfo({ parentId });
    if (res.code == 200) {
      largeLevelSelectedData.value =
        res.result.map((x) => {
          return { id: x.materialCategoryInfoId, name: x.materialCategoryName };
        }) || [];
    }
  } catch (error) {}
};
const getSelectedDataByPrimaryLevel = async (parentId) => {
  try {
    const res = await getMaterialCategoryInfo({ parentId });
    if (res.code == 200) {
      primaryMaterialSelectedData.value =
        res.result.map((x) => {
          return { id: x.materialCategoryInfoId, name: x.materialCategoryName };
        }) || [];
      if (primaryMaterialSelectedData.value.length == 0) {
        secondaryMaterialSelectedData.value = [];
        secondaryMaterialDisabled.value = false;
        // primaryMaterialDisabled.value = false;
        getThirdLevelListdata();
      }
    }
  } catch (error) {}
};
const getSelectedDataBySecondaryMaterial = async (parentId) => {
  try {
    const res = await getMaterialCategoryInfo({ parentId });
    if (res.code == 200) {
      secondaryMaterialSelectedData.value =
        res.result.map((x) => {
          return { id: x.materialCategoryInfoId, name: x.materialCategoryName };
        }) || [];
    }
  } catch (error) {}
};
getSelectedDataByLevel(-1);
const getThirdLevelListdata = async () => {
  try {
    console.log("第三级");
    const temp = {
      materialCategory: ruleForm.materialCategoryName,
      primaryMaterials: ruleForm.primaryMaterialName,
      primaryMaterials: ruleForm.primaryMaterialName,
      secondaryMaterials: ruleForm.secondaryMaterialName,
    };
    const res = await getMaterialInfos({ ...temp, count: false });
    if (res.code == 200) {
      thirdMaterialSelectedData.value =
        res.result.list.map((x) => {
          return { id: x.materialInfoId, name: x.materialName };
        }) || [];
    }
  } catch (error) {}
};
// getThirdLevelListdata();
const materialSupplierNameList = ref([]);
const getMaterialSupplierNameList = async () => {
  try {
    const param = { count: false };
    const res = await getMaterialSupplierInfos(param);
    if (res.code == 200) {
      materialSupplierNameList.value =
        res.result.list.map((x) => {
          return { id: x.materialSupplierInfoId, name: x.materialSupplierName };
        }) || [];
    }
  } catch (error) {}
};
getMaterialSupplierNameList();

watch(
  () => ruleForm.materialCategoryName,
  (newV) => {
    if (newV != "") {
      primaryMaterialDisabled.value = false;
      getSelectedDataByPrimaryLevel(newV);
    } else {
      primaryMaterialDisabled.value = true;
    }
    getThirdLevelListdata();
  }
);
watch(
  () => ruleForm.primaryMaterialName,
  (newV) => {
    if (newV != "") {
      secondaryMaterialDisabled.value = false;
      getSelectedDataBySecondaryMaterial(newV);
    } else {
      if (primaryMaterialDisabled.value == false) {
        secondaryMaterialDisabled.value = false;
      } else {
        secondaryMaterialDisabled.value = true;
      }
    }
    getThirdLevelListdata();
  }
);
watch(
  () => ruleForm.secondaryMaterialName,
  (newV) => {
    if (newV != "") {
      thirdMaterialDisabled.value = false;
      getThirdLevelListdata();
    } else {
      if (secondaryMaterialDisabled.value == false) {
        getThirdLevelListdata();
      }
    }
  }
);
const handleSubmit = (item) => {
  ElMessageBox.confirm("确定提交么?", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      const res = await submitCommodityInfo([item.commodityInfoId]);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "提交成功",
        });
        getListData();
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消",
      });
    });
};
const handlePutOnByAdmin = (item) => {
  ElMessageBox.confirm("确定上架么?", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      const res = await putOnCommodityInfo([item.commodityInfoId]);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "上架成功",
        });
        getListData();
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消",
      });
    });
};
const handleExamine = (item) => {
  currentRow.value = item;
  ElMessageBox.confirm("确定审核么?", "提示", {
    confirmButtonText: "通过",
    cancelButtonText: "拒绝",
    type: "warning",
  })
    .then(async () => {
      const res = await examineCommodityInfo({
        commodityInfoIds: [item.commodityInfoId],
        isPass: true,
      });
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "审核成功",
        });
        getListData();
      }
    })
    .catch(() => {
      outerVisible.value = true;
    });
};
const handlePutOff = (item) => {
  ElMessageBox.confirm("确定下架么?", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      const res = await putOffCommodityInfo([item.commodityInfoId]);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "下架成功",
        });
        getListData();
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消",
      });
    });
};

const getIndex = (index) => {
  return (currentPage.value - 1) * pageSize.value + index + 1;
};
const dialogTitle = ref("添加商品");
const dialogType = ref("add");
const dialogVisible = ref(false);
const centerDialogVisible = ref(false);
const currentRow = ref();
const copyLinkValue = ref("");
const copyLinkActive = ref(false);
const handleEdit = (item) => {
  console.log("item", item);
  dialogTitle.value = "编辑商品";
  dialogType.value = "edit";
  currentRow.value = item;
  dialogVisible.value = true;
  nextTick(() => {
    ruleForm.materialSupplierName = item.materialSupplierInfoId;

    ruleForm.coverPage = item.coverPage
      ? item.coverPage.split(",").map((url) => {
          return { url };
        })
      : [];
    ruleForm.commodityName = item.commodityName;
    ruleForm.brand = item.brand;
    ruleForm.materialCategoryName = item.materialCategory;
    ruleForm.primaryMaterialName = item.primaryMaterials;
    ruleForm.secondaryMaterialName = item.secondaryMaterials;
    ruleForm.materialName = item.tertiaryMaterials;
    ruleForm.model = item.model;
    ruleForm.specifications = item.specifications;
    ruleForm.producer = item.producer;
    ruleForm.isRovideSample = item.isRovideSample
      ? "1"
      : !item.isRovideSample
      ? "2"
      : "";
  });
};
const handleListing = (item) => {};
const copyLink = (item) => {
  centerDialogVisible.value = true;
  copyLinkValue.value = item.link;
  copyLinkActive.value = false;
};
const confirmCopy = () => {
  copyLinkActive.value = true;
  setTimeout(() => {
    centerDialogVisible.value;
    ElMessage({
      type: "success",
      message: "复制邀请",
    });
  }, 1000);
};
const rejectHanldle = async () => {
  if (reason.value == "") {
    return ElMessage({
      type: "warning",
      message: "请输入原因",
    });
  }
  try {
    const res = await examineCommodityInfo({
      isPass: false,
      reason: reason.value,
      commodityInfoIds: [currentRow.value.commodityInfoId],
    });
    if (res.code == 200) {
      ElMessage({
        type: "success",
        message: "审核不通过",
      });
      getListData();
      outerVisible.value = false;
    }
  } catch (error) {}
};
const handleDelete = (item) => {
  ElMessageBox.confirm("确认删除此商品信息?", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(async () => {
      const res = await deleteCommodityInfo({
        commodityInfoId: item.commodityInfoId,
        recordVersion: item.recordVersion,
      });
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "删除成功",
        });
        getListData();
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除",
      });
    });
};
const copyRow = (item) => {
  ElMessage({
    type: "success",
    message: "复制成功",
  });
  setTimeout(() => {
    dialogTitle.value = "添加商品";
    dialogType.value = "add";
    dialogVisible.value = true;
    nextTick(() => {
      ruleForm.materialSupplierName = item.materialSupplierInfoId;
      ruleForm.coverPage = item.coverPage
        ? item.coverPage.split(",").map((url) => {
            return { url };
          })
        : [];
      ruleForm.commodityName = item.commodityName;
      ruleForm.brand = item.brand;
      ruleForm.materialCategoryName = item.materialCategory;
      ruleForm.primaryMaterialName = item.primaryMaterials;
      ruleForm.secondaryMaterialName = item.secondaryMaterials;
      ruleForm.materialName = item.tertiaryMaterials;
      ruleForm.model = item.model;
      ruleForm.specifications = item.specifications;
      ruleForm.producer = item.producer;
      ruleForm.isRovideSample = item.isRovideSample
        ? "1"
        : !item.isRovideSample
        ? "2"
        : "";
    });
  }, 500);
};
const handleAdd = () => {
  dialogTitle.value = "添加商品";
  dialogType.value = "add";
  currentRow.value = {};
  dialogVisible.value = true;
  nextTick(() => {
    ruleFormRef.value.resetFields();
  });
};
const tableData = ref([]);
const getListData = async () => {
  const params = {
    pageId: 1,
    pageSize: 20,
    count: false,
    status: formInline.status,
  };
  try {
    const res = await getCommodityInfos(params);
    if (res.code == 200) {
      const result = res.result.list || [];

      tableData.value = result;
    }
  } catch (error) {
    console.log("error", error);
  }
};
getListData();
const onSubmit = () => {
  getListData();
};

// 上传相关
const handleExceed = (files) => {
  // upload.value.clearFiles()
  // const file = files[0]
  // file.uid = genFileId()
  // upload.value.handleStart(file)
  ElMessage({
    message: "只能上传一张图片,请先删除当前图片",
    type: "error",
  });
};
const handleUploadChange = (prop, file, files) => {
  for (let i = 0; i < files.length; i++) {
    const perobj = {
      percentage: 0,
      isshow: false,
    };
    // this.percenarr.push(perobj)
    if (files[i].size / 1024 > 1024 * 300) {
      ElMessage.error(`上传的第${i + 1}个视频超过300M！`);
    }
    let md5 = "";

    const sparkMD5 = new SparkMD5();
    const reader = new FileReader();
    reader.readAsText(file.raw);
    reader.onload = async (event) => {
      //获取文件MD5
      const str = event.target.result;
      sparkMD5.append(str);
      md5 = sparkMD5.end();

      const res = await getInitMultipartUploadWithPublic(md5);
      // 生成随机文件名，防止文件名冲突
      const key = res.result.encodedObjectName;
      console.log("获取文件MD5", res);
      if (res.result.isExist) {
        const tempFile = await getPublicFileUrl({ resourceKey: key });
        console.log("tempFile", tempFile);
        ruleForm[prop] = [{ url: tempFile.result || "" }];
        return false;
      }
      const token = res.result.upToken;
      uploadfunc(prop, file, token, key, i);
    };
  }
};
const uploadfunc = async (prop, file, uploadtoken, key, i) => {
  const config = {
    useCdnDomain: true,
    domain: publicFileUrl.value,
    chunkSize: 10,
    forceDirect: false,
  };
  const putExtra = {
    fname: file.name, //文件原始文件名
    params: {},
    mimeType: "",
  };
  const observable = qiniu.upload(file.raw, key, uploadtoken, putExtra, config);
  observable.subscribe({
    next: (result) => {
      console.log("上传成功下一步。", result);
    },
    error: (err) => {
      //上传错误后触发
      console.log("上传失败", err);
    },
    complete: (result) => {
      //上传成功后触发。包含文件地址。
      if (result.code == 200) {
        ruleForm[prop] =
          [{ url: publicFileUrl.value + result.result.key || "" }] || [];
        ElMessage({
          message: "上传成功",
          type: "success",
        });
      }
    },
  });
};

const ruleFormRef = ref();

const rules = reactive({});
const confirmForm = async () => {
  const param = {
    ...ruleForm,
    coverPage:
      (ruleForm.coverPage &&
        ruleForm.coverPage.length > 0 &&
        ruleForm.coverPage[0].url) ||
      "",
    materialSupplierInfoId: ruleForm.materialSupplierName,
    materialCategory: ruleForm.materialCategoryName,
    primaryMaterials: ruleForm.primaryMaterialName,
    secondaryMaterials: ruleForm.secondaryMaterialName,
    tertiaryMaterials: ruleForm.materialName,
    isRovideSample:
      ruleForm.isRovideSample == "1"
        ? true
        : ruleForm.isRovideSample == "2"
        ? false
        : "",
  };
  console.log("confirm", param);
  try {
    if (dialogType.value == "add") {
      const res = await addCommodityInfos(param);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "添加成功",
        });
        dialogVisible.value = false;
        getListData();
      }
    } else {
      const temp = {
        ...param,
        recordVersion: currentRow.value.recordVersion,
        commodityInfoId: currentRow.value.commodityInfoId,
      };
      const res = await modifyCommodityInfo(temp);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "编辑成功",
        });
        dialogVisible.value = false;
        getListData();
      }
    }
  } catch (error) {}
};
</script>
<style lang="scss" scoped>
.table-wrap {
  padding: 20px;
  .form-header {
    display: flex;
    justify-content: space-between;
  }
}
.demo-ruleForm {
  width: 100%;
  .el-select {
    width: 100%;
  }
}
.link-content {
  height: 80px;
  padding: 10px 20px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  &.active {
    background: #cff4df;
    border-color: #cff4df;
  }
}
</style>
